<template>
  <el-table
    :data="data"
    border
    style="width: 100%"
    :row-style="showTr">
    <el-table-column v-for="(column, index) in columns" :key="column.dataIndex"
      :label="column.text">
      <template scope="scope">
        <span v-if="spaceIconShow(index)" v-for="(space, levelIndex) in scope.row._level" :key="levelIndex" class="ms-tree-space"></span>
        <button class="button is-outlined is-primary is-small" v-if="toggleIconShow(index,scope.row)" @click="toggle(scope.$index)">
          <i v-if="!scope.row._expanded" class="el-icon-caret-right" aria-hidden="true"></i>
          <i v-if="scope.row._expanded" class="el-icon-caret-bottom" aria-hidden="true"></i>
        </button>
        <span v-else-if="index===0" class="ms-tree-space"></span>
        {{scope.row[column.dataIndex]}}
      </template>
    </el-table-column>
    <el-table-column label="操作" v-if="treeType === 'normal'" width="260">
      <template scope="scope">
        <button type="button" class="el-button el-button--default el-button--small">
          <router-link
            :to="{ path: requestUrl + 'edit', query: {id: scope.row.Oid} }"
            tag="span">
            编辑
          </router-link>
        </button>
        <el-button
          size="small"
          type="danger"
          @click="handleDelete()">
          删除
        </el-button>
        <button type="button" class="el-button el-button--success el-button--small">
          <router-link :to="{ path: requestUrl, query: {parentId: scope.row.parentOId} }"
                       tag="span">
            添加下级树结构
          </router-link>
        </button>
      </template>
    </el-table-column>
  </el-table>
</template>
<script>
import axios from "axios";
export default {
  methods: {
    choiseonly(){
      this.choisevalue = this.$refs.tree.getCheckedKeys();
      console.log(this.choisevalue);
      this.$emit("call",this.choisevalue)

    },
      getCheckedKeys() {
    this.choisevalue = this.$refs.tree.getCheckedKeys();
      console.log(this.choisevalue);
    },
    handleNodeClick(data) {
         console.log(data);
         this.choisedValue = data;
         this.$emit("call",this.choisedValue,this.data)
    },
  },
  props:["oldmenus","isshow"],
  data() {
    return {
      data: [],
      defaultProps: {
        children: "menus",
        label: "menuname",
      },
      //用于菜单权限选择用的
      choisevalue:[],
      show:this.isshow,
      // 用于修改菜单用的
      choisedValue:{}
    };
  },
  //钩子函数
  created() {
      axios.get("Menu/findAllMenu")
      .then((res)=>{
        console.log(res)
          this.data = res.data
      })
      .catch((err)=>{})
  },
  watch: {
      oldmenus:function(newValue,oldValue){
          this.choisevalue = newValue;
          this.$refs.tree.setCheckedKeys(this.choisevalue);
        //   this.choisevalue = newValue.menuids;
        console.log("新值",newValue)
      },
      isshow:function(newValue,oldValue){
          this.show = newValue;
        console.log("新值",newValue)
      },
  },
};
</script>
